<template>
  <Basic title="确认" :show-dialog="showLogoutDialog" @cancel="handleCancel" @confirm="handleConfirmDialog">
    <div class="pt-5 text-center">
      <p>确认退出吗？</p>
    </div>
  </Basic>
</template>

<script lang="ts">
import { computed, defineComponent, ref } from 'vue'
import { useUserStore } from '@/store/user'
import Basic from './Basic.vue'

export default defineComponent({
  name: 'Accept',
  components: {
    Basic
  },
  setup() {
    const store = useUserStore()
    const showLogoutDialog = computed(() => store.showLogoutDialog)

    const result = ref('');
    const showCalendar = ref(false);

    const handleConfirmCalendar = (date:any) => {
      result.value = `${date.getMonth() + 1}/${date.getDate()}`;
      showCalendar.value = false;
    };

    const handleCancel = () => {
      store.setShowLogoutDialog(false)
    }

    const handleConfirmDialog = () => {
      store.setShowLogoutDialog(false)
      store.logout()
      location.replace('/')
    }

    return {
      showLogoutDialog,
      result,
      handleConfirmCalendar,
      showCalendar,
      handleCancel,
      handleConfirmDialog
    };
  }
})
</script>

